HTML : “Marque tag” সম্পর্কে অদ্যপন্ত্য!!মজা পাবেন must!! আমার আজকের টিউটোরিয়াল টি “ marquee tag ” বিষয়ক । আমার বিশ্বাস , ব্যাপক মজা পাবেন । আপনারা অনেক সময় দেখেন বিভিন্ন পত্রিকার ওয়েবসাইট এর সংবাদ শিরোনাম ডান থেকে বামে ঘুরছে, হ্যাঁ সেটিই আজকে আমি দেখাব , কত সহজে কাজটি করা যায়। যারা ওয়েব ডেভলপমেন্ট পেশায় আছেন তারা বিষয় টি ভালই জানেন। তবে আজকে বিষয় টি নিয়ে বিস্তারিত লিখব।
প্রথমে আপনার নোটপ্যাডটি ওপেন করুন। শুরুতে পেজটিতে <html> ও শেষে </html> কোড লিখুন। এবার আপনার তৈরি পেজ টিকে marquee.html এই নামে সেভ করুন। অবশ্যই খেয়াল রাখবেন যাতে extension এ .txt এর বদলে .html থাকে।
এবার মূল আলোচনায় আসি।
যদি আপনি কো টেক্সট কে ডান থেকে বামে ঘুরাতে চান, তাহলে,
<marquee behavior=”slide” direction=”left”>Your slide-in text goes here</marquee>
এই কোডের direction এর মান চেঞ্জ করে আপনি বাম থেকে ডানেও টেক্সট ঘুরাতে পারবেন। শুধু left এর যায়গায় right দিতে হবে। নিজে চেষ্টা করুন!
যদি আপনি এর স্পিড বাড়াতে চান ,
<marquee behavior=”scroll” direction=”left” scrollamount=”30″>Your continuous scrollable text goes here</marquee>
scrollamount এর মান যত বেশি হবে টেক্সট তত জোড়ে ঘুরবে। এইখানে এটি 30.
আপনি যদি চান এই Text টি ওয়েবপেজের মধ্যে মধ্যেই বাউন্স করবে , তাহলে
<marquee behavior=”alternate”>Your bouncing text goes here</marquee>
behavior এর মান alternate দেয়ার কারনেই এটি বাউন্স করে।
নিজের ইচ্ছামত আপনারা এই টেক্সট কে উপর থেকে নিচে অথবা নিচ থে উপরেও মুভ করাতে পারবেন।
<marquee behavior=”scroll” direction=”up”>Your upward scrolling text goes here</marquee>
উপরের কোডের মাধ্যমে যেকোন টেক্সট নিচ থেকে উপরে যাবে।
যদি জাম্পিং টেক্সট দেখতে চান , তাহলে,
<marquee behavior=”scroll” direction=”left” scrollamount=”80″ scrolldelay=”500″>Your continuous scroll text goes here</marquee>
পরিশেষে আপনাদের “marquee tag” এর কিছু Attributes নিয়ে সংখিপ্ত আলোচনা।
width Sets the width of the marquee scrollamount How far to jump as it moves
height Sets the height of the marquee loop How many times it should loop
direction Sets the direction of the marquee bgcolor Sets the background color of the marquee
behavior Whether to slide, bounce, or scroll hspace Sets the amount of horizontal space around the marquee
scrolldelay How long the marquee should wait before each jump vspace Sets the amount of vertical space around the marquee
A total code : At last!!
একই সাথে তিনটি ভিন্ন মানের স্পিডে চলাচল কারি টেক্সট করতে হলে,
<html>
<marquee behavior=”scroll” direction=”right” scrollamount=”1″>Tortoise</marquee>
<marquee behavior=”scroll” direction=”right” scrollamount=”10″>Hare</marquee>
<marquee behavior=”scroll” direction=”right” scrollamount=”20″>Cheetah</marquee>
</html>
Tortoise
Hare
Cheetah আমার আজকের টিউটোরিয়াল টি “ marquee tag ” বিষয়ক । আমার বিশ্বাস , ব্যাপক মজা পাবেন । আপনারা অনেক সময় দেখেন বিভিন্ন পত্রিকার ওয়েবসাইট এর সংবাদ শিরোনাম ডান থেকে বামে ঘুরছে, হ্যাঁ সেটিই আজকে আমি দেখাব , কত সহজে কাজটি করা যায়। যারা ওয়েব ডেভলপমেন্ট পেশায় আছেন তারা বিষয় টি ভালই জানেন। তবে আজকে বিষয় টি নিয়ে বিস্তারিত লিখব।
প্রথমে আপনার নোটপ্যাডটি ওপেন করুন। শুরুতে পেজটিতে <html> ও শেষে </html> কোড লিখুন। এবার আপনার তৈরি পেজ টিকে marquee.html এই নামে সেভ করুন। অবশ্যই খেয়াল রাখবেন যাতে extension এ .txt এর বদলে .html থাকে।
এবার মূল আলোচনায় আসি।
যদি আপনি কো টেক্সট কে ডান থেকে বামে ঘুরাতে চান, তাহলে,
<marquee behavior=”slide” direction=”left”>Your slide-in text goes here</marquee>
এই কোডের direction এর মান চেঞ্জ করে আপনি বাম থেকে ডানেও টেক্সট ঘুরাতে পারবেন। শুধু left এর যায়গায় right দিতে হবে। নিজে চেষ্টা করুন!
যদি আপনি এর স্পিড বাড়াতে চান ,
<marquee behavior=”scroll” direction=”left” scrollamount=”30″>Your continuous scrollable text goes here</marquee>
scrollamount এর মান যত বেশি হবে টেক্সট তত জোড়ে ঘুরবে। এইখানে এটি 30.
আপনি যদি চান এই Text টি ওয়েবপেজের মধ্যে মধ্যেই বাউন্স করবে , তাহলে
<marquee behavior=”alternate”>Your bouncing text goes here</marquee>
behavior এর মান alternate দেয়ার কারনেই এটি বাউন্স করে।
নিজের ইচ্ছামত আপনারা এই টেক্সট কে উপর থেকে নিচে অথবা নিচ থে উপরেও মুভ করাতে পারবেন।
<marquee behavior=”scroll” direction=”up”>Your upward scrolling text goes here</marquee>
উপরের কোডের মাধ্যমে যেকোন টেক্সট নিচ থেকে উপরে যাবে।
যদি জাম্পিং টেক্সট দেখতে চান , তাহলে,
<marquee behavior=”scroll” direction=”left” scrollamount=”80″ scrolldelay=”500″>Your continuous scroll text goes here</marquee>
পরিশেষে আপনাদের “marquee tag” এর কিছু Attributes নিয়ে সংখিপ্ত আলোচনা।
width Sets the width of the marquee scrollamount How far to jump as it moves
height Sets the height of the marquee loop How many times it should loop
direction Sets the direction of the marquee bgcolor Sets the background color of the marquee
behavior Whether to slide, bounce, or scroll hspace Sets the amount of horizontal space around the marquee
scrolldelay How long the marquee should wait before each jump vspace Sets the amount of vertical space around the marquee
A total code : At last!!
একই সাথে তিনটি ভিন্ন মানের স্পিডে চলাচল কারি টেক্সট করতে হলে,
<html>
<marquee behavior=”scroll” direction=”right” scrollamount=”1″>Tortoise</marquee>
<marquee behavior=”scroll” direction=”right” scrollamount=”10″>Hare</marquee>
<marquee behavior=”scroll” direction=”right” scrollamount=”20″>Cheetah</marquee>
</html>
Tortoise
Hare
Cheetah
